<template>
    <div tabindex="0" class="et-input mb-[2px]!" :class="{
        'ntopabuttom': !label && !required
    }">
        <v-text-field tabindex="0" v-bind="$attrs" :rounded="false"
            class="focus:border-solid! focus:border-[#4d90fe]! focus:border-1!">
            <template #label>
                <span class="flex items-center font-avenir! text-[#333]">
                    <i class="iconfont icon-required text-[red] text-2 mr-[1px]" v-if="required"></i> {{ label }}
                </span>
            </template>
            <template v-for="item in Object.keys($slots)" v-slot:[item]>
                <slot :name="item"></slot>
            </template>
        </v-text-field>
    </div>
</template>


<script setup lang="ts">
import type { InputProps } from './interface';
const sad = (aaaa) => {
    console.log('input', aaaa)
}
defineProps<InputProps>()
</script>

<style lang="scss" scoped>
@use "./style.scss" as *;

.ntopabuttom {
    :deep(input) {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}
</style>